<template>
  <el-row class="di1">
    <el-col class="di2">
        <el-col class="di3">
            基本信息
        </el-col>
        <el-col class="di4">
            <el-col class="di5">
                入住时间：14:00之后
            </el-col>
            <el-col class="di5">
                离店时间：12:00之前
            </el-col>
            <el-col class="di5">
                {{data.creation_time}}/{{ data.renovat_time }}
            </el-col>
            <el-col class="di5">
                酒店规模：{{ data.roomCount}}间客房
            </el-col>
        </el-col>
    </el-col>
    <el-col class="di2">
        <el-col class="di3">
            主要设施
        </el-col>
            <el-col class="di4">
            <span class="di6" v-for="(item,index) in data.hotelassets" :key="index">{{item.name}}</span>
        </el-col>
    </el-col>
    <el-col class="di2">
        <el-col class="di3">
            停车服务
        </el-col>
        <el-col class="di4">
                -
            </el-col>
    </el-col>
    <el-col class="di2">
        <el-col class="di3">
            品牌信息
        </el-col>
        <el-col class="di4">
            <el-col>
                {{data.hotelbrand.name}}
            </el-col>
        </el-col>
    </el-col>
</el-row>
</template>

<script>
export default {
    props:{
        data:
        {
            type:Object,
            default:()=>({})
        }
    }
}
</script>

<style scoped lang="less">
.di1{
    margin: 40px 0;
}
.di2{
    border-bottom: 1px solid #eee;
    box-sizing: border-box;
}
.di3{
    padding: 20px 10px;
    font-size: 14px;
    width: 16.66667%;
}
.di4{
    padding: 20px 10px;
    font-size: 14px;
    width: 83.33334%;
}
.di5{
    padding-left: 5px;
    padding-right: 5px;
    width: 25%;
    float: left;
    color: #666;
}
.di6{
    border: 1px solid #eee;
    padding: 4px 10px;
    margin-right: 10px;
    border-radius: 4px;
    background-color: #eee;
    color: #666;
}
</style>